<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>新增车位</title>
    <link rel="stylesheet" href="mobile/layui/css/layui.mobile.css">
    <link rel="stylesheet" href="mobile/layui/css/layui.css">
    <link rel="stylesheet" href="mobile/css/yj_css.css">
</head>
<body>
<header class="yj-header">
    <a href="javascript:history.go(-1)" class="yj-header-return layui-icon">&#xe603;</a>
    <span>新增车位</span>
    <a class="yj-header-meau"></a>
</header>
<div class="yj-content">
    <form id="addcarparkform" action="/sharepark/lessor/addcarpark" method="post" enctype="multipart/form-data">
        <div class="yj-padding-big">
            <div class="yj-bgfff yj-pad-lr-big yj-form1">
                <p class="yj-list-item yj-border-b yj-form1-item">
                    <label class="yj-form1-label">车位地点：</label>
                    <input type="text" id="community_input" style="width: 50px;" name="nameOrAddress">
                    <select class="yj-select yj-border yj-bgfff yj-pad-lr" name="communityID" id="communityID">
                        <option value="">请选择车位小区</option>
                    </select>
                </p>
                <p class="yj-list-item yj-form1-item">
                    <label class="yj-form1-label">详细地址：</label>
                    <input class="yj-pad-lr" type="text" placeholder="请输入您车位的详细地址" name="address" id="address">
                </p>
                <p class="yj-list-item yj-form1-item">
                    <label class="yj-form1-label">始租时间：</label>
                    <input class="yj-pad-lr" type="number" placeholder="请输入您期望出租车位的起始时间" name="timeStart"
                           id="timeStart">
                </p>
                <p class="yj-list-item yj-form1-item">
                    <label class="yj-form1-label">终租时间：</label>
                    <input class="yj-pad-lr" type="number" placeholder="请输入您期望结束出租的终止时间" name="timeEnd" id="timeEnd">
                </p>
                <p class="yj-list-item yj-form1-item">
                    <label class="yj-form1-label">车位价格：</label>
                    <input class="yj-pad-lr" type="number" placeholder="请输入您期望出租的价格" name="price" id="price">
                </p>
                <p class="yj-list-item yj-form1-item">
                    <label class="yj-form1-label">产权信息：</label>
                    <input class="yj-pad-lr" type="file" style="width: 225px;padding-top: 12px" name="propertyInfo"
                           id="propertyInfo">
                </p>
                <p class="yj-list-item yj-form1-item">
                    <label class="yj-form1-label">车位图片：</label>
                    <input class="yj-pad-lr" type="file" style="width: 225px;padding-top: 12px" name="carParkPic"
                           id="carParkPic">
                </p>
            </div>
            <div class="yj-mar-t-big yj-pad-lr-big yj-bgfff">
                <div class="yj-pad-tb-big yj-form2-item">
                    <label class="yj-form2-label">添加方式：</label>
                    <div class="yj-form2-container">
            <span class="yj-mar-r-big yj-label-btn">
              <input class="yj-none" type="radio" id="label1" name="label" checked>
              <label for="label1" class="layui-btn layui-btn-xs layui-btn-radius yj-pad-lr-big">单个</label>
            </span>
                        <span class="yj-mar-r-big yj-label-btn">
              <input class="yj-none" type="radio" id="label2" name="label">
              <label for="label2" class="layui-btn layui-btn-xs layui-btn-radius yj-pad-lr-big">批量</label>
            </span>
                    </div>
                </div>
            </div>
            <div class="yj-bgfff yj-pad-lr-big yj-form1 yj-add-single">
                <p class="yj-list-item yj-border-b yj-form1-item">
                    <label class="yj-form1-label">车位号：</label>
                    <input class="yj-pad-lr" type="text" placeholder="请输入您的车位号" name="numberStart"
                           id="singelernumberstart">
                </p>
            </div>
            <div class="yj-bgfff yj-pad-lr-big yj-form1 yj-add-company" style="display: none;">
                <p class="yj-list-item yj-border-b yj-form1-item">
                    <label class="yj-form1-label">起始车位：</label>
                    <input class="yj-pad-lr" type="text" placeholder="请输入您的起始车位号" name="" id="doublenumberstart">
                </p>
                <p class="yj-list-item yj-border-b yj-form1-item">
                    <label class="yj-form1-label">终止车位：</label>
                    <input class="yj-pad-lr" type="text" placeholder="请输入您的终止车位号" name="" id="doublenumberend">
                </p>
            </div>
        </div>
    </form>
    <div class="yj-recharge-btn yj-text-center">
        <button class="layui-btn layui-btn-fluid layui-btn-radius yj-bg-main" onclick="addcarpark()">上传</button>
    </div>
</div>
<script th:src="@{/mobile/js/jquery.min.js}"></script>
<script type="text/javascript">
    $(":input[name='label']").change(function () {
        var isChecked = $("#label2").prop("checked");
        if (isChecked == true) {
            $(".yj-add-company").show();
            $(".yj-add-single").hide();
            $("#doublenumberend").attr("name", "numberEnd");
            $("#doublenumberstart").attr("name", "numberStart");
            $("#singelernumberstart").attr("name", "");
        } else {
            $(".yj-add-single").show();
            $(".yj-add-company").hide();
            $("#doublenumberend").attr("name", "");
            $("#doublenumberstart").attr("name", "");
            $("#singelernumberstart").attr("name", "numberStart");
        }
    });

    function addcarpark() {
        var formdata = new FormData();
        formdata.append("communityID", $("#communityID").val());
        if ($("#label2").prop("checked") == true) {
            formdata.append("numberStart", parseInt($("#doublenumberstart").val()));
            formdata.append("numberEnd", parseInt($("#doublenumberend").val()))
        } else {
            formdata.append("numberStart", parseInt($("#singelernumberstart").val()));
        }
        formdata.append("address", $("#address").val());
        formdata.append("timeStart", parseInt($("#timeStart").val()));
        formdata.append("timeEnd", parseInt($("#timeEnd").val()));
        formdata.append("price", parseInt($("#price").val()));
        formdata.append("propertyInfo", document.getElementById("propertyInfo").files[0]);
        formdata.append("carParkPic", document.getElementById("carParkPic").files[0]);
        $.ajax({
            url: "/sharepark/lessor/addcarpark",
            type: "post",
            async: false,
            data: formdata,
            contentType: false,  //需要设置为false,不然后台拿不到数据
            processData: false,  //传送DOM信息,所以设为false
            success: function (data) {
                alert(data.msg);
                if (data.code == 200){
                    window.location.href = "/sharepark/lessorindex"
                }
            }
        })

    }

    $(document).ready(function () {
        $("#community_input").bind('input propertychange', function () {
            $.ajax({
                url: "/sharepark/community/search",
                type: "post",
                data: {
                    nameOrAddress: $("#community_input").val()
                },
                success: function (data) {
                    $("#communityID").empty();
                    for (var i = 0; i < data.length; i++) {
                        $("#communityID").append("<option value=\"" + data[i].comId + "\">" + data[i].comName + "</option>")
                    }
                }
            })
        })
    })
</script>
</body>
</html>